@extends('layouts.default')

@section('title', '教研活动')

@push('scripts')
<script>
    var filters = {};
    var per_page = 10;
    var totalNum = 0;
    layui.use(['layer','form','table','laytpl','laydate','element','laypage'], function(){
        var layer = layui.layer;
        var form = layui.form;
        var table = layui.table;
        var laytpl = layui.laytpl;
        var laydate = layui.laydate;
        var element = layui.element;
        var laypage = layui.laypage;
        var first = 0;
        var category = '';
        renderSelect();

        laydate.render({
            elem: '#range-date'
            ,type: 'date'
            ,range: true
        });

        // 搜索查询
        form.on('submit(queryBtn)', function(data) {
            var param = data.field;
            filters = param
            getList(1, per_page);
        });
        // 重置
        form.on('submit(resetBtn)', function(data) {
            filters = {};
            $('#qryForm')[0].reset();
            getList(1, per_page)
        });
        form.on('submit(exportBtn)', function(data) {
            var param = data.field;
            var para = {
                "search": param,
                "form_key": "TEACHERTRAINING_ACTIVITY_TABLE"
            };

            exportTeaActivity(para, function(res) {
                if (res.code == '9') {
                    layer.msg(res.msg, {icon: 5, shift: 6});
                } else {
                    exportsDel('教研活动信息列表.xlsx', '/download/excel/'+res.data.file_name);
                }
            });
        });
        // 获取页面数据
        function getList(page, limit) {
            if ($.isEmptyObject(filters)){
                let param = form.val("qryForm");
                filters = param;
            }
            filters.activity_category = $('#activity_category').val();
            filters.category = '';
            var para = {
                "page": page,
                "search": filters,
                "limit": limit,
            };

            getFilesList(para, function(res){
                if(res.code === 1) {
                    if(totalNum != res.data.total) {
                        totalNum = res.data.total;
                        per_page = res.data.limit;
                        renderPageBar(page,per_page)
                    }
                    from = res.data.from
                    table.render({
                        data: res.data.data,
                        elem: '#tablelist',
                        defaultToolbar: [],
                        cellMinWidth: 80, //全局定义常规单元格的最小宽度，layui 2.2.1 新增
                        limit: res.data.limit,
                        skin: 'nob',
                        even:true,
                        cols: [[
                            {field: 'name',width:'35%', title: '资源名称', align: 'center',templet: function(d) {
                                    return '<a href="'+d.path+'" style="color: #0e90d2;" target="_blank" title="'+d.name+'" >'+d.name+'</a><a style="color:#74B8FF" href="'+d.path+'" download="'+d.name+'"> <span class="icon pear-icon pear-icon-download" style="color:#74B8FF;margin-left:10px;"></span></a>';
                            }},
                            {field: 'nickname', title: '教师姓名', align: 'center'},
                            {field: 'activity_category_name', title: '来源', align: 'center'},
                            {field: 'created_at', title: '日期', align: 'center'},
                        ]],
                        id:"tableIns",
                        done: function(res, curr, count) {
                            curr_page = page;
                        },
                        page: false,
                    });
                    if(first == 0) {
                        first++;
                        $('[data-role=fromList]').empty().append('<option value="">请选择</option>');
                        for (var i in from) {
                            $('[data-role=fromList]').append('<option value="' + i + '">' + from[i] + '</option>');
                        }
                        form.render();
                    }
                } else {
                    layer.msg(res.msg, {time: 2000, icon: 5});
                }
            });
        }

        function getTaskData(page,limit){
            para = {
                "page": page,
                "limit": limit,
                "status": 1
            };
            getTaskList(para,function(res){
                if(res.code == 1){
                    let tplhtml = $("#systemsTask").html();
                    layui.laytpl(tplhtml).render(res.data.data, function (html) {
                        $("#systemsTaskHtml").append(html);
                    });
                }else {
                    layer.msg(res.msg, {icon: 5});
                }

            })
        }

        // 获取页面数据
        function getAwardData(page, limit) {
            param = {'activity_category':'TEACHER_AWARD_TABLE','category':category};
            filters = param;
            var para = {
                "page": page,
                "search": filters,
                "limit": limit,
            };

            getFilesList(para, function(res){
                if(res.code === 1) {
                    if(totalNum != res.data.total) {
                        totalNum = res.data.total;

                        per_page = res.data.limit;
                        renderAwardPageBar(page,per_page)
                    }
                    from = res.data.from
                    table.render({
                        data: res.data.data,
                        elem: '#awardTablelist',
                        defaultToolbar: [],
                        cellMinWidth: 80, //全局定义常规单元格的最小宽度，layui 2.2.1 新增
                        limit: res.data.limit,
                        skin: 'nob',
                        even:true,
                        cols: [[
                            {field: 'name', width:"35%",title: '资源名称', align: 'center',templet: function(d) {
                                    return '<a href="'+d.path+'" style="color: #0e90d2;" target="_blank" title="'+d.name+'" >'+d.name+'</a><a style="color:#74B8FF" href="'+d.path+'" download="'+d.name+'"> <span class="icon pear-icon pear-icon-download" style="color:#74B8FF;margin-left:10px;"></span></a>';
                                }},
                            {field: 'category_name', title: '荣誉类型', align: 'center'},
                            {field: 'level_name', title: '级别', align: 'center'},
                            {field: 'created_at', title: '日期', align: 'center'},
                        ]],
                        id:"awardTableIns",
                        done: function(res, curr, count) {
                            curr_page = page;
                        },
                        page: false,
                    });
                } else {
                    layer.msg(res.msg, {time: 2000, icon: 5});
                }
            });
        }

        // 渲染页面
        function renderPageBar(page,limit) {
            laypage.render({
                elem: 'pageBar',
                count: totalNum, //数据总数，从服务端得到
                curr: page,
                first: '第一页',
                last: '最后一页',
                limit:limit,
                layout: ['limit','count', 'prev', 'page', 'next', 'skip'],
                jump: function(obj, first) {
                    //首次不执行
                    if(!first) {
                        layer.closeAll();
                        getList(obj.curr,obj.limit)
                    }
                }
            });
        }

        // 渲染页面
        function renderAwardPageBar(page,limit) {
            laypage.render({
                elem: 'awardPageBar',
                count: totalNum, //数据总数，从服务端得到
                curr: page,
                first: '第一页',
                last: '最后一页',
                limit:limit,
                layout: ['limit','count', 'prev', 'page', 'next', 'skip'],
                jump: function(obj, first) {
                    //首次不执行
                    if(!first) {
                        layer.closeAll();
                        getList(obj.curr,obj.limit)
                    }
                }
            });
        }
        // 渲染页面
        function renderAwardPageBar(page,limit) {
            laypage.render({
                elem: 'awardPageBar',
                count: totalNum, //数据总数，从服务端得到
                curr: page,
                first: '第一页',
                last: '最后一页',
                limit:limit,
                layout: ['limit','count', 'prev', 'page', 'next', 'skip'],
                jump: function(obj, first) {
                    //首次不执行
                    if(!first) {
                        layer.closeAll();
                        getAwardData(obj.curr,obj.limit)
                    }
                }
            });
        }

        //切换
        element.on('tab(basicTab)', function (data) {
            basicTabId = $(this).attr('lay-id');
            if(basicTabId == 2){
                getAwardData(1,per_page);
            }else{
                filters = {};
                $('#qryForm')[0].reset();
                getList(1,per_page);

            }
        });
        //监听行工具事件
        table.on('tool(tablelist)', function(obj){
            var data = obj.data;
            if(obj.event === 'del'){

            }
        });

        function exportsDel(showName,fileName){
            window.location.href = "{{ route('download.FileDownloadDel') }}?filename="+showName+"&file_url="+fileName;
        }

        //下拉框初始化
        async function renderSelect(){
            await renderDictionarySelect();
            await renderTermSelect();
            await renderDicSelect();
            getList(1, per_page);
            getTaskData(1,4);
        }

        //字典下拉框数据渲染
        function renderDictionarySelect() {
            return new Promise((resolve) => {
                getDictionaryItem({'diccode': ['LEVEL', 'SUBJECT','GRADE', 'CLASSITEM','award_type']}, function (res){
                    if(res.code === 1) {
                        let data = res.data;
                        var html = ''
                        for(var k in data) {
                            let key = k.toLowerCase();
                            let d = data[k];
                            if(key == 'award_type'){
                                for (var i in d) {
                                    html = html + '<a class="layui-btn award-title layui-btn-primary"  data-id="'+d[i].optionId+'">'+d[i].selectValue+'</a>';
                                }
                            }else {
                                $('[data-role=' + key + 'List]').empty().append('<option value="">请选择</option>');
                                for (var i in d) {
                                    $('[data-role=' + key + 'List]').append('<option value="' + d[i].optionId + '">' + d[i].selectValue + '</option>');
                                }
                            }
                        }
                        $('.awardHtml').html(html);
                        form.render();

                        resolve();
                    }
                });
            });
        }
        $(document).on('click','.awardWarp a',function (){
            $('.click-this').addClass('layui-btn-primary');
            $('.click-this').removeClass('click-this');
            $(this).addClass('click-this');
            $(this).removeClass('layui-btn-primary');
            category = $(this).attr('data-id');
            getAwardData(1,per_page);
        });
        //学期下拉框数据渲染
        function renderTermSelect() {
            return new Promise((resolve) => {
                getTermData({},function(res){
                    if(res.code == 1){
                        $('[data-role=termList]').empty().append('<option value="">请选择</option>');
                        for(var i in res.data){
                            $('[data-role=termList]').append('<option value="'+res.data[i].id+'">'+res.data[i].title+'</option>');
                        }

                        form.render('select');

                        resolve();
                    }
                });
            });
        }

        //字典下拉框数据渲染
        function renderDicSelect() {
            return new Promise((resolve) => {
                getDicListByCodes({'diccode': ['SUBJECT', ]}, function (res){
                    if(res.code === 1) {
                        let data = res.data;

                        for(var k in data) {
                            let key = k.toLowerCase();
                            alert(key)
                            $('[data-role='+key+'List]').empty().append('<option value="">请选择</option>');
                            let d = data[k];
                            for (var i in d) {
                                $('[data-role='+key+'List]').append('<option value="' + d[i].itemcode + '">' + d[i].itemname + '</option>');
                            }
                        }

                        form.render();

                        resolve();
                    }
                });
            });
        }

    });
</script>
@endpush

@section('content')
    <style>
        #qryForm .layui-input-inline{
            width:140px !important;
        }
        #qryForm .layui-form-label{
            width: 70px;
        }
        #qryForm .layui-form-label{
            padding: 9px 5px;
        }
        .img_box_wrap .img_wrap{
            text-align: right;
            padding-right: 15px;
        }
        .img_box_wrap .text_wrap{
            float: left;
        }
        .img_wrap_text {
            font-family: 'Century Gothic Negreta', 'Century Gothic Normal', 'Century Gothic';
            font-weight: 700;
            font-style: normal;
            font-size: 22px;
            color: #3057C4;
        }
        .grid-user_growth{
            padding-top:15px;
        }
        .img_box_wrap{
            border-right: 0.5px solid rgb(245,245,245);
        }
        .right_wrap .right_title{
            font-family: '微软雅黑 Bold', '微软雅黑 Regular', '微软雅黑';
            font-weight: 700;
            font-style: normal;
            font-size: 16px;
        }
        .text_center{
            text-align: center;
        }
        .right_number{
            font-family: 'Century Gothic Negreta', 'Century Gothic Normal', 'Century Gothic';
            font-weight: 700;
            font-style: normal;
            font-size: 22px;
            color: #3057C4;
            height:33px
        }
        .right_desc{
            padding-left: 5%;
            padding-top: 10px;
            padding-bottom: 8px;
        }
        .right_task{
            line-height: 20px;
            font-size: 12px;
        }
        .taskRow{
            margin-top: 10px;
            margin-bottom: 10px;
            padding-bottom: 10px;
            border-bottom: 1px solid rgb(245,245,245);
        }
        .taskEnd{
            float: right;
            padding-right: 5%;
            text-decoration: underline;
        }
        .click-this{
            background-color: rgba(48, 87, 196, 1) !important;
            color:#ffffff !important;
        }
        .award-title{
            min-width:82px;
            background-color: #ffffff;
            color:#000000;
        }
        #systemsTaskHtml{
            font-family: '阿里巴巴普惠体 2.0 55', '阿里巴巴普惠体 2.0';
            font-weight: 400;
            font-style: normal;

        }
        #systemsTaskHtml div{
            line-height: 24px;
        }
    </style>

<div class="layui-card">
    <div class="layui-card-body" style="margin-top:30px">
        <div class="layui-row layui-col-space1 grid-user_growth">
            <div class="layui-col-md2 img_box_wrap">
                <div class="layui-col-md6 img_wrap"><img src ="{{env('APP_URL')}}/static/image/gkjx.png" width="50" height="50"/></div>
                <div class="layui-col-md6 text_wrap">
                <div>公开教学</div>
                <div id="number_gkjx" class="img_wrap_text">{{$data['teach']['gkjx']}}</div>
                </div>
            </div>
            <div class="layui-col-md2 img_box_wrap">
                <div class="layui-col-md6 img_wrap"><img src ="{{env('APP_URL')}}/static/image/jyjl.png" width="50" height="50"/></div>
                <div class="layui-col-md6 text_wrap">
                    <div>经验交流</div>
                    <div id="number_jyjl" class="img_wrap_text">{{$data['teach']['jyjl']}}</div>
                </div>
            </div>
            <div class="layui-col-md2 img_box_wrap">
                <div class="layui-col-md6 img_wrap"><img src ="{{env('APP_URL')}}/static/image/ktyj.png" width="50" height="50"/></div>
                <div class="layui-col-md6 text_wrap">
                    <div>课题研究</div>
                    <div id="number_jyjl" class="img_wrap_text">{{$data['teach']['ktyj']}}</div>
                </div>
            </div>
            <div class="layui-col-md2 img_box_wrap">
                <div class="layui-col-md6 img_wrap"><img src ="{{env('APP_URL')}}/static/image/lwfb.png" width="50" height="50"/></div>
                <div class="layui-col-md6 text_wrap">
                    <div>文章发表</div>
                    <div id="number_lwfb" class="img_wrap_text">{{$data['teach']['lwfb']}}</div>
                </div>
            </div>
            <div class="layui-col-md2 img_box_wrap">
                <div class="layui-col-md6 img_wrap"><img src ="{{env('APP_URL')}}/static/image/lzfb.png" width="50" height="50"/></div>
                <div class="layui-col-md6 text_wrap">
                    <div>论著发表</div>
                    <div id="number_lzfb" class="img_wrap_text">{{$data['teach']['lzfb']}}</div>
                </div>
            </div>
            <div class="layui-col-md2 img_box_wrap">
                <div class="layui-col-md6 img_wrap"><img src ="{{env('APP_URL')}}/static/image/kfkm.png" width="50" height="50"/></div>
                <div class="layui-col-md6 text_wrap">
                    <div>开发科目</div>
                    <div id="number_kfkm" class="img_wrap_text">{{$data['teach']['kfkm']}}</div>
                </div>
            </div>
        </div>
    </div>
</div>
    <div style="margin-top: 35px;">
        <div class="layui-card layui-col-md8" style="with:65% !important;margin-right: 2%">
            <div class="layui-card-body">
                <div class="layui-tab layui-tab-brief" lay-filter="basicTab">
                    <ul class="layui-tab-title">
                        <li class="layui-this" lay-id="1">学校资源</li>
                        <li lay-id="2">荣誉获奖</li>
                    </ul>

                    <div class="layui-tab-content" id="basic-tab-content">
                        <div class="layui-tab-item layui-show">
                            <div class="layui-row">
                                <form id="qryForm" class="layui-form" action="">
                                    <div class="layui-form-item">
                                        <div class="layui-inline">
                                            <label class="layui-form-label">学年学期：</label>
                                            <div class="layui-input-inline">
                                                <select name="data_version_id" lay-filter="termList" data-role="termList"></select>
                                            </div>
                                        </div>
                                        <div class="layui-inline">
                                            <label class="layui-form-label">学科：</label>
                                            <div class="layui-input-inline">
                                                <select name="course" lay-filter="subjectList" data-role="subjectList"></select>
                                            </div>
                                        </div>

                                        <div class="layui-inline">
                                            <label class="layui-form-label">年级：</label>
                                            <div class="layui-input-inline">
                                                <select name="grade" lay-filter="gradeList" data-role="gradeList"></select>
                                            </div>
                                        </div>

                                        <div class="layui-inline">
                                            <label class="layui-form-label" >来源:</label>
                                            <div class="layui-input-inline">
                                                <select name="activity_category" lay-filter="fromList" data-role="fromList" id="activity_category">

                                                </select>
                                            </div>
                                        </div>
                                        <div class="layui-inline">
                                            <label class="layui-form-label">资源名称：</label>
                                            <div class="layui-input-inline">
                                                <input type="text" name="name" id="name"   placeholder="请输入"  autocomplete="off" class="layui-input">
                                            </div>
                                        </div>
                                        <div class="layui-inline">
                                            <button type="button" lay-submit lay-filter="queryBtn" class="layui-btn layui-btn-normal">查询</button>
                                            <button type="button" lay-submit lay-filter="resetBtn" class="layui-btn layui-btn-primary">重置</button>
                                        </div>
                                    </div>
                                </form>

                            </div>
                            <table class="layui-hide" id="tablelist" lay-filter="tablelist" lay-data="{id: 'tablelist'}"></table>
                            <div class="pagebarbox" style="text-align: end"><div id="pageBar" class="pagebar"></div></div>
                        </div>
                        <div class="layui-tab-item">
                            <div class="awardWarp">
                                <a  class="layui-btn click-this award-title">全部</a>
                                <span class="awardHtml"></span>
                            </div>
                            <table class="layui-hide" id="awardTablelist" lay-filter="awardTablelist" lay-data="{id: 'awardTablelist'}"></table>
                            <div class="pagebarbox" style="text-align: end"><div id="awardPageBar" class="pagebar"></div></div>
                        </div>
                    </div>
                </div>

            </div>

        </div>
        <div class="layui-col-md3" style="width:30% !important">
            <div class="layui-card  tableList right_wrap layui-row" >
                <div class="layui-card-header right_title">教师培训</div>
                <div class="layui-row">
                    <div class="layui-col-md3 right_desc">
                        <div>校本培训</div>
                        <div id="number_xbpx" class="right_number">{{$data['train']['xbpx']}}</div>
                    </div>
                    <div class="layui-col-md3 right_desc">
                        <div>参与教研</div>
                        <div id="number_cyjy" class="right_number">{{$data['train']['cyky']}}</div>
                    </div>
                    <div class="layui-col-md3 right_desc">
                        <div>外出培训</div>
                        <div id="number_wcpx" class="right_number">{{$data['train']['wcpx']}}</div>
                    </div>
                    <div class="layui-col-md3 right_desc">
                        <div>其他培训</div>
                        <div id="number_qtpx" class="right_number">{{$data['train']['qtpx']}}</div>
                    </div>
                </div>
                <div class="layui-col-md12 layui-card-header right_title">获奖情况</div>
                <div  style="margin-top:25px">
                    <div class="layui-col-md4 right_desc">
                        <div>团队获奖</div>
                        <div id="number_tdhj" class="right_number">{{$data['award']['tdhj']}}</div>
                    </div>
                    <div class="layui-col-md4 right_desc">
                        <div>荣誉称号</div>
                        <div id="number_rych" class="right_number">{{$data['award']['rych']}}</div>
                    </div>
                    <div class="layui-col-md4 right_desc">
                        <div>骨干称号</div>
                        <div id="number_ggch" class="right_number">{{$data['award']['ggch']}}</div>
                    </div>
                </div>
                <div class="layui-col-md4 right_desc">
                    <div>各类评比</div>
                    <div id="number_glpb" class="right_number">{{$data['award']['glpb']}}</div>
                </div>
                <div class="layui-col-md4 right_desc">
                    <div>班级获奖</div>
                    <div id="number_bjhj" class="right_number">{{$data['award']['bjhj']}}</div>
                </div>
                <div class="layui-col-md4 right_desc">
                    <div>其他获奖</div>
                    <div id="number_qthj" class="right_number">{{$data['award']['qthj']}}</div>
                </div>
                <div class="layui-col-md4 right_desc">
                    <div>各类指导奖</div>
                    <div id="number_glzd" class="right_number">{{$data['award']['glzdj']}}</div>
                </div>
                <div class="layui-col-md12 layui-card-header right_title">重要工作</div>
                <div class="layui-col-md3 right_desc">
                    <div>带教情况</div>
                    <div id="number_djqk" class="right_number">{{$data['job']['djqk']}}</div>
                </div>
                <div class="layui-col-md3 right_desc">
                    <div>校内工作</div>
                    <div id="number_wngz" class="right_number">{{$data['job']['xngz']}}</div>
                </div>
                <div class="layui-col-md3 right_desc">
                    <div>校外工作</div>
                    <div id="number_xwgz" class="right_number">{{$data['job']['xwgz']}}</div>
                </div>
            </div>
            <div class="layui-card  right_wrap layui-row" style="margin-top: 15px">
                <div class="layui-col-md12 layui-card-header right_title">待办事项</div>
                <div class="layui-col-md12 right_task right_desc" style="padding-top: 0px">
                    <div id="systemsTaskHtml"></div>
                    <div class="taskEnd"><a href="/systems/task">更多...</a></div>
                </div>
            </div>
        </div>
    </div>
    <script type="text/html" id="systemsTask">
        @{{#  layui.each(d, function(index, item){ }}
        <div class="taskRow">
            <div>@{{item.name}}<br></div>
            <div>
                事件类型:@{{#if (item.status == 1){}}待处理@{{# }else if(item.status == 2){  }}已处理@{{#} }} &nbsp;&nbsp;&nbsp;创建人:@{{item.creator_name}} &nbsp;&nbsp;&nbsp;@{{item.created_at}}
            </div>
        </div>
        @{{# }); }}
    </script>
@endsection
